@charset "UTF-8";
@import "../common/scss/mobile";
@import "../common/scss/mixins";
@import "../common/scss/sprites";
body{
	height:100%;
}

header{
   background:url(/images/code/code-detail-bg.png) no-repeat center center;
   background-size:100%;
   height:16.5rem;
   position:relative;
   color:#fff;
   text-align:center;
   font-size:$fs11;
   margin:1rem 1rem 0;
   .donation{
   		.icon-donation{
   			@include mix-donation();
   		}
		position:absolute;
		top:1rem;
		right:1rem;
   }
   .price{
   	   font-size:3.5rem;
		padding:1.4rem 0;
	   em{
   			font-size:2.7rem;
	   }
   }
   .title{
		font-size:$fs15;
   }
   .condition{
   		padding:0.4rem 0;
       span{
	       position:relative;
	       display:inline-block;
	       padding:0 3.2rem;
	       &:before,&:after{
	       	position:absolute;
	       	content:"";
	       	width:2.5rem;
	       	height:1.5px;
	       	top:50%;
	       	background-color:#fff;
	       }
	       &:before{

	       	left:0;


	       }
	       &:after{
	       	right:0;
	       }
       }

   }
   .valid-time{

   }
}
.frow{
	@include flexbox;
}
.btns{
    text-align:center;
    padding:2rem 1.4rem 1rem;
    .joinbox,.soon-use,.soon-receive{
    	@include flex-grow(1);
    }


	button{
		text-align:center;
	    background-color:#fff;
	    border:1.5px solid #00c267;
	    height:3.6rem;
	    @include border-radius();
	    font-size:$fs15;
	    color:#00c267;
	    width:90%;
	    &:only-child{
	    	width:100%;
	    }
	}
    .soon-receive{
	    button{
	    	text-align:center;
	    }
    }
	.block-btn{
		button{
			width:100%;
		}
	}
}
article{
	padding:1.4rem;
	font-size:$fs11;
	color:#666;
	line-height:1.8rem;
	h2{
		font-size:$fs15;
		color:#333;
		padding-bottom:0.4rem;
	}
}
.footer{
	text-align:center;
	.navmenu{		
		span{
			font-size: 1.1rem;
			color:#666;
			margin:0 0.8rem;
		}
		.separator{
          
		}
		padding:0.8rem 0;
	}
	.copyright{
	    .mopon-logo{
		    background:url(/images/mopon-logo.png?v=1) no-repeat center center;
			background-size:100%;
			display:inline-block;
			width:5.1rem;
			height:1.1rem;
		}
		.support{
		   font-size:0.9rem;
		}
		.separate{
		     display:inline-block;
			 width:0;
			 height:1.1rem;
			 border-left:1.5px solid #999;
			 margin:0 0.8rem;
		}
	}
}
@import "../common/scss/layer";
@import "../common/scss/pages/follow";
.donation-tip{	
	display:none;
	background-color:rgba(0,0,0,.85);
	position:absolute;
	left:0;
	top:0;
	height:100%;
	width:100%;
	.tips-icon{
		text-align:right;
		padding:1rem 3rem 2rem 0;
		.icon-donation-tips{
			background:url(/images/code/donation-tips.png) no-repeat center center;
			background-size:100%;
			width:9.7rem;
			height:10rem;
			display:inline-block;
		}
	}
	.tips-text{
		font-size:$fs15;
		color:#fff;
		text-align:center;
	}
}
